
<template lang="pug">
.scene
  el-card.search-card
    bwt-search(
      v-model="params",
      :items="searchItems",
      @search="search",
      @clear="clear"
    )
      template(#button)
        el-button(
          type="primary"
          icon="el-icon-upload"
          @click="edit()"
        ) 上传场景文件
    bwt-table(
      ref="table",
      :columns="columnsItems",
      :api="getSceneListApi",
      :params="getParams"
    )
  edit-dialog(
    v-model="isShowEdit"
    :data="editData"
    :text="pageText"
    :lines="lineList"
    @confirm="refresh"
  )
</template>

<script setup name="Scene">

import { getLineListApi, getStationListApi, getSceneListApi } from '@/api/base'
import EditDialog from './scene-edit/index.vue'
import columns from './columns.jsx';
import searchForm from './search-form.jsx';
import { ElMessage, ElMessageBox } from 'element-plus'
const { proxy } = getCurrentInstance();
const lineList = ref([]);
const stationList = ref([]);
const columnsItems = columns({ showDetail, edit, remove });
const searchItems = searchForm({
  lineList,
  stationList,
  getStationList
});
const table = ref();
const params = ref({});
const isShowEdit = ref(false);
const editData = ref(null);
const pageText = '场景';
const getParams = computed(() => {
  return {
    ...params.value
  }
})

function search() {
  table.value.search()
}
function clear() {}

function showDetail(row) {
  console.log('showDetail', row)
}
function edit(row = null) {
  editData.value = row
  isShowEdit.value = true
}
function remove(row) {
  ElMessageBox.confirm('确认删除该条数据？', '温馨提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
  }).then(() => {
    // deleteSceneApi({
    //   scene_id: row.scene_id
    // }).then(() => {
    //   ElMessage.success(`删除成功`)
    //   refresh()
    // })
  })
}
function refresh() {
  table.value.refresh()
}

function getLineList() {
  getLineListApi().then(rsp => {
    lineList.value = rsp || []
  })
}
function getStationList() {
  params.value.station_id = ''
  getStationListApi({
    line_id: params.value.line_id
  }).then(rsp => {
    stationList.value = rsp || []
  })
}

onUpdated(() => {
  search()
})

getLineList()

defineExpose({
  lineList,
  showDetail
})
</script>
